let data = {
  "chart": [{
    month: "周一",
    value: 138,
    ratio: 14.89
  },

  {
    month: "周二",
    value: 114,
    ratio: 79.49
  },

  {
    month: "周三",
    value: 714,
    ratio: 75.8
  },

  {
    month: "周四",
    value: 442,
    ratio: 19.8
  },

  {
    month: "周五",
    value: 622,
    ratio: 44.5
  },


  {
    month: "周六",
    value: 528,
    ratio: 87.3
  },
  {
    month: "周日",
    value: 728,
    ratio:  90.3
  }

  ]
}


let xAxisMonth = [],
  barData = [],
  lineData = [];
for (let i = 0; i < data.chart.length; i++) {
  xAxisMonth.push(data.chart[i].month);
  barData.push({
    "name": xAxisMonth[i],
    "value": data.chart[i].value
  });
  lineData.push({
    "name": xAxisMonth[i],
    "value": data.chart[i].ratio
  });
}
export default {
  title: {
    text: "B站上周投稿趋势",
    left: "center",
    textStyle: {
      color: "#fff",
      fontSize: 14,
      fontWeight: "normal",
      textAlign: "center",
    },
  },
  backgroundColor: "#040D21",
  grid: {
    top: '15%',
    left: '15%',
    bottom: '6%',
    right:'5%',
    containLabel: true
  },
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: 'none'
    },
    formatter: function (params) {
      return params[0]["data"].name + "<br/>" + '投稿数: ' + params[1]["data"].value + "<br/>" + '在线率: ' + params[0]["data"].value;
    }
  },
  xAxis: [{
    type: 'category',
    show: false,
    data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
    axisLabel: {
      textStyle: {
        color: '#fff'
      }
    }
  },
  {
    type: 'category',
    position: "bottom",
    data: xAxisMonth,
    boundaryGap: true,
    // offset: 40,
    axisTick: {
      show: false
    },
    axisLine: {
      show: false
    },
    axisLabel: {
      textStyle: {
        color: '#fff'
      }
    }
  }

  ],
  yAxis: [{
    show: true,
    offset: 52,
    splitLine: {
      show: false,
      lineStyle: {
        color: "rgba(255,255,255,0.2)"
      }
    },
    axisTick: {
      show: false
    },
    axisLine: {
      show: true
    },
    axisLabel: {
      show: true,
      color: '#fff'
    }
  }, {
    show: false,
    type: "value",
    name: "在线率(%)",
    nameTextStyle: {
      color: 'fffc'
    },
    axisLabel: {
      color: 'fff'
    },
    splitLine: {
      show: false
    },
    axisLine: {
      show: false
    },
    axisTick: {
      show: false
    }
  }],
  color: ['#e54035'],
  series: [{
    name: '投稿数',
    type: 'pictorialBar',
    xAxisIndex: 1,
    barCategoryGap: '-80%',
    // barCategoryGap: '-5%',
    symbol: 'path://d="M150 50 L130 130 L170 130  Z"',
    itemStyle: {
      normal: {
        color: function (params) {
          let colorList = [
            'rgba(13,177,205,0.8)', 'rgba(29,103,182,0.6)',
            'rgba(13,177,205,0.8)', 'rgba(29,103,182,0.6)',
            'rgba(13,177,205,0.8)', 'rgba(29,103,182,0.6)'
          ];
          return colorList[params.dataIndex];
        }
      },
      emphasis: {
        opacity: 1
      }
    },
    data: barData,
  },
  {
    symbol: 'image://',
    symbolSize: 42,
    name: "完成率",
    type: "line",
    yAxisIndex: 1,
    data: lineData,
    itemStyle: {
      normal: {
        borderWidth: 5,
        color: {
          colorStops: [{
            offset: 0,
            color: '#821eff'
          },

          {
            offset: 1,
            color: '#204fff'
          }
          ],
        }
      }
    }
  }
  ]
}